<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
    <title>Document</title>
    <link rel="stylesheet" href="./index.css">
</head>
<body>
    <div id="wrap">
        <header class="header">
            <div class="head">
                <h1><a href="#"><img src="images/logo.png" alt=""></a></h1>
                <div class="search">
                    <span class="iconfont">&#xe70c;</span>搜索商品, 共57086款好物
                </div>
                <button>登录</button>
            </div>
            <div class="channel">
                <div class="title">全部频道</div>
                <div class="scrollWrap">
                    <div class="inner">
                        <a href="#" class="active">推荐</a>
						<a href="#">居家生活</a>
						<a href="#">服饰鞋包</a>
						<a href="#">美食酒水</a>
						<a href="#">个护清洁</a>
						<a href="#">母婴亲子</a>
						<a href="#">运动旅行</a>
						<a href="#">数码家电</a>
						<a href="#">严选全球</a>
                    </div>
                    <div class="more">
                        <div>
                            <span class="iconfont">&#xe54a;</span>
                        </div>
                    </div>
                </div>
            </div>
        </header>
        
		<div class="banner">
			<div class="wrap">
				<a href="#">
					<img src="images/banner_01.png"
						srcset="images/banner_01.png 2x, images/banner_01@3x.png 3x" alt="">
				</a>
				<a href="#"><img src="images/banner_02.png" alt=""></a>
				<a href="#"><img src="images/banner_03.png" alt=""></a>
				<a href="#"><img src="images/banner_04.png" alt=""></a>
				<a href="#"><img src="images/banner_05.png" alt=""></a>
				<a href="#"><img src="images/banner_06.png" alt=""></a>
				<a href="#"><img src="images/banner_07.png" alt=""></a>
				<a href="#"><img src="images/banner_08.png" alt=""></a>
			</div>
			<div class="circle">
				<span class="active"></span>
				<span></span>
				<span></span>
				<span></span>
				<span></span>
				<span></span>
				<span></span>
				<span></span>
			</div>
		</div>

        <nav class="nav">
			<ul class="service">
				<li><span class="iconfont">&#xe69d;</span><span>网易自营品牌</span></li>
				<li><span class="iconfont">&#xe604;</span><span>30天无忧退货</span></li>
				<li><span class="iconfont">&#xe62e;</span><span>48小时快速退款</span></li>
			</ul>
			<ul class="navList">
				<li>
					<a href="#">
						<img src="images/nav_01.png" alt="">
						<span>新品首发</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/nav_02.png" alt="">
						<span>居家生活</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/nav_03.png" alt="">
						<span>服饰鞋包</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/nav_04.png" alt="">
						<span>美食酒水</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/nav_05.png" alt="">
						<span>个护清洁</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/nav_06.png" alt="">
						<span>母婴亲子</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/nav_07.png" alt="">
						<span>运动旅行</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/nav_08.png" alt="">
						<span>数码家电</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/nav_09.png" alt="">
						<span>全球特色</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/nav_10.gif" alt="">
						<span>好货抄底</span>
					</a>
				</li>
			</ul>
		</nav>
		<div class="ad1">
			<a href="#"><img src="images/ad.gif" alt=""></a>
		</div>
		<div class="ad2">
			<a href="#"><img src="images/ad_01.png" alt=""></a>
			<a href="#"><img src="images/ad_02.png" alt=""></a>
		</div>
		<div class="newPeople">
			<h3><span>新人专享礼</span></h3>
			<div class="content">
				<a href="#" class="left">
					<h4>新人专享礼包</h4>
					<div class="img"></div>
				</a>
				<div class="right">
					<a href="#">
						<h4>福利社</h4>
						<p>今日特价</p>
						<div class="discount">
							<div>¥8.9</div>
							<div>¥9.9</div>
						</div>
					</a>
					<a href="#">
						<h4>新人拼团</h4>
						<p>1元起包邮</p>
						<div class="discount">
							<div>¥8.9</div>
							<div>¥9.9</div>
						</div>
					</a>
				</div>
			</div>
		</div>
		<div class="hot">
			<h3>类目热销榜</h3>
			<div>
				<a href="#">
					<span>热销榜</span>
					<img src="images/img_04.png" alt="">
				</a>
				<a href="#">
					<span>好评榜</span>
					<img src="images/img_05.png" alt="">
				</a>
			</div>
			<ul>
				<li>
					<a href="#">
						<span>居家生活榜</span>
						<img src="images/img_06.png" alt="">
					</a>
				</li>
				<li>
					<a href="#">
						<span>美食酒水榜</span>
						<img src="images/img_07.png" alt="">
					</a>
				</li>
				<li>
					<a href="#">
						<span>服饰鞋包榜</span>
						<img src="images/img_08.png" alt="">
					</a>
				</li>
				<li>
					<a href="#">
						<span>个护清洁榜</span>
						<img src="images/img_09.png" alt="">
					</a>
				</li>
				<li>
					<a href="#">
						<span>数码家电榜</span>
						<img src="images/img_10.png" alt="">
					</a>
				</li>
				<li>
					<a href="#">
						<span>严选全球榜</span>
						<img src="images/img_11.png" alt="">
					</a>
				</li>
				<li>
					<a href="#">
						<span>母婴亲子榜</span>
						<img src="images/img_12.png" alt="">
					</a>
				</li>
				<li>
					<a href="#">
						<span>运动旅行榜</span>
						<img src="images/img_13.png" alt="">
					</a>
				</li>
			</ul>
		</div>
		<ul class="guide">
			<li>
				<a href="#">
					<h3>超值专区</h3>
					<h4>低至9.9元</h4>
					<img src="images/img_14.png" alt="">
					<img src="images/img_15.png" alt="">
				</a>
			</li>
			<li>
				<a href="#">
					<h3>奥莱特卖</h3>
					<h4>全场2折起</h4>
					<img src="images/img_16.png" alt="">
					<img src="images/img_17.png" alt="">
				</a>
			</li>
		</ul>

		<footer class="foot">
			<div class="btn">
				<a href="#">下载APP</a><a href="#">电脑版</a>
			</div>
			<p>网易公司版权所有 © 1997-2021</p>
			<p>食品经营许可证：JY13301080111719</p>
		</footer>

		<nav class="footerNav">
			<a href="#" class="active">
				<span class="iconfont">&#xe639;</span>
				<span>首页</span>
			</a>
			<a href="#">
				<span class="iconfont">&#xe612;</span>
				<span>分类</span>
			</a>
			<a href="#">
				<span class="iconfont">&#xe690;</span>
				<span>值得买</span>
			</a>
			<a href="#">
				<span class="iconfont">&#xe680;</span>
				<span>购物车</span>
			</a>
			<a href="#">
				<span class="iconfont">&#xe617;</span>
				<span>个人</span>
			</a>
		</nav>
		<a href="javascript:;" class="backTop"><span class="iconfont">&#xe501;</span></a>
		<div class="shadow"></div>
	</div>
	<script src="index.js"></script>
</body>
</html>